﻿<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <base th:href="${#request.getContextPath()}+'/'">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <!--[if lt IE 9]>
    <script type="text/javascript" src="lib/html5shiv.js"></script>
    <script type="text/javascript" src="lib/respond.min.js"></script>
    <![endif]-->
    <link rel="stylesheet" type="text/css" href="static/h-ui/css/H-ui.min.css"/>
    <link rel="stylesheet" type="text/css" href="static/h-ui.admin/css/H-ui.admin.css"/>
    <link rel="stylesheet" type="text/css" href="lib/Hui-iconfont/1.0.8/iconfont.css"/>
    <link rel="stylesheet" type="text/css" href="static/h-ui.admin/skin/default/skin.css" id="skin"/>
    <link rel="stylesheet" type="text/css" href="static/h-ui.admin/css/style.css"/>
    <link rel="stylesheet" type="text/css" href="../plugins/bootstrap-3.3.7-dist/css/bootstrap.css"/>
    <!--[if IE 6]>
    <script type="text/javascript" src="lib/DD_belatedPNG_0.0.8a-min.js"></script>
    <script>DD_belatedPNG.fix('*');</script>
    <![endif]-->
    <title>商品列表</title>
    <link rel="stylesheet" href="lib/zTree/v3/css/zTreeStyle/zTreeStyle.css" type="text/css">
</head>
<body class="pos-r">
        <div class="container">
            <nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页 <span class="c-gray en">&gt;</span> 业务管理 <span
                    class="c-gray en">&gt;</span> 产品列表 <a class="btn btn-success radius r"
                                                          style="line-height:1.6em;margin-top:3px"
                                                          href="javascript:location.replace(location.href);" title="刷新"><i
                    class="Hui-iconfont">&#xe68f;</i></a>
            </nav>
                <div class="mt-20">
                    <table class="table table-bordered">
                        <tr>
                            <td>
                                <div class="cl pd-5 bg-1 bk-gray"><span class="l"><a href="javascript:;" onclick="deleteGoods()" class="btn btn-danger radius">
                                    <i class="Hui-iconfont">&#xe6e2;</i> 批量删除</a>
                                    <a class="btn btn-primary radius" href="/goods/insert" onclick="admin_role_add('添加角色','','800')">
                                        <i class="Hui-iconfont">&#xe600;</i> 修改商品</a> </span> <span class="r"></span>
                                </div>
                            </td>
                        </tr>
                        <table class="table table-border table-bordered table-hover table-bg">
                            <thead>
                            <tr class="text-c">
                                <th>序号</th>
                                <th>选择</th>
                                <th>商品名称</th>
                                <th>商品图片</th>
                                <th>商品图片</th>
                                <th>商品图片</th>
                                <th>商户名称</th>
                                <th>套餐</th>
                            </tr>
                            </thead>
                            <tbody id="goodsBody">

                            </tbody>
                        </table>
                    </table>
                    <div >
                        <nav aria-label="Page navigation">
                            <ul class="pagination" id="pageList">
                            </ul>
                        </nav>
                    </div>
                </div>
        </div>


<!--_footer 作为公共模版分离出去-->
<script type="text/javascript" src="lib/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="lib/layer/2.4/layer.js"></script>
<script type="text/javascript" src="static/h-ui/js/H-ui.min.js"></script>
<script type="text/javascript" src="static/h-ui.admin/js/H-ui.admin.js"></script> <!--/_footer 作为公共模版分离出去-->

<!--请在下方写此页面业务相关的脚本-->
<script src="https://cdn.jsdelivr.net/npm/html5shiv@3.7.3/dist/html5shiv.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/respond.js@1.4.2/dest/respond.min.js"></script>
<script type="text/javascript" src="lib/zTree/v3/js/jquery.ztree.all-3.5.min.js"></script>
<script type="text/javascript" src="lib/My97DatePicker/4.8/WdatePicker.js"></script>
<script type="text/javascript" src="lib/datatables/1.10.0/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="lib/laypage/1.2/laypage.js"></script>
<script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script>
<script src="../plugins/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
<script src="../plugins/bootstrap-ztree/js/bootstrap-treeview.min.js"></script>
<script type="text/javascript">
    $(function () {
        refreshData(1);
    });

    function deleteGoods() {
        //获取选择的商品的id
        var cbs = $("input[name='cbs']");
        var ids = [];
        var index = 0;
        for (var i = 0; i < cbs.length; i++) {
            if (cbs[i].checked) {
                ids[index] = cbs[i].value;
                index++;
            }
        }
        console.log(ids);
        var obj = {};

        obj['goodId'] = ids;
        $.ajax({
            url:'goods/delete',
            type:'POST',
            data:JSON.stringify(obj),
            contentType: "application/json",
            success: function (data) {
                alert(data.message);
                if (data.success) {
                    window.location.href="product-list.html";
                }
            }
        })
    }

    function showData (resultData) {
        var arr =resultData.data;
        $("#goodsBody").html("");
        for(var i=0;i<arr.length;i++){
            var goods  = arr[i];
            var trStr = "<tr>"+
                "<td>"+(i+1)+"</td>"+
                "<td><input type='checkbox' name='cbs' value='"+goods.goodId+"'/></td>"+
                "<td>"+goods.goodName+"</td>"+
                "<td><img src='"+goods.goodPic+"' style='height: 35px'/></td>"+
                "<td><img src='"+goods.goodPic1+"' style='height: 35px'/></td>"+
                "<td><img src='"+goods.goodPic2+"' style='height: 35px'/></td>"+
                "<td>"+goods.customerId+"</td>"+
                "<td><a href='#'>查看套餐</a></td>"+
                "</tr>"
            $("#goodsBody").append(trStr);
            }



        var pageCount = resultData.pageCount;
        var pageNum = resultData.pageNum;

        $("#pageList").html("");
        $("#pageList").append("<li><a onclick='refreshData(1)'>首页</a></li>");
        for (var i=1;i<=pageCount;i++) {
            var liTag ="";
            if (i == pageNum) {
                liTag = "<li><a  style='background: deepskyblue; color: white'>"+i+"</a></li>";
            } else {
                liTag = "<li><a  onclick='refreshData("+i+")'>"+i+"</a></li>";
            }
            $("#pageList").append(liTag);
        }
        $("#pageList").append("<li><a onclick='refreshData("+pageCount+")'>尾页</a></li>");
    };

    function refreshData(pn) {
        $.post("goods/list",{pageNum:pn},function(resultData) {
            showData(resultData);
        },"json")
    }

</script>

</body>
</html>